

<template>
  <div>
    <el-button class="butB_Sel" @click="printBtn()">打印</el-button>
    <div class="app-container" id="printcons" style="">
      <div
        class=""
        style="
          width: 1050px;
          height: 1450px;
          margin: auto;
       
          font-size: 14px;
     
        "
            
      >
        <div>
            
          <h2 style="text-align: center; margin: 0 5px">
          {{tabeldata.print_title }}
          </h2>

          <p style="width: 30%; float: left">
            进货单位:
            <span style="">{{ tabeldata.supply_org }}</span>
          </p>
          <p style="width: 30%; float: left">
            单据号:
            <span style="">{{ tabeldata.number }}</span>
          </p>
             <p style="width: 30%; float: left">
            入库时间:
            <span style="">{{ tabeldata.updated_at }}</span>
          </p>
       
            
            <table
            border="1"
            width="1050"
            align="center"
            cellspacing="0"
            cellpadding="0"


          >  
          <thead>
            <th>药品名称</th>
            <th>规格</th>
            <th>批号</th>
            <th>数量</th>
            <th>单位</th>
            <th>购入价</th>
            <th>购入金额</th>
            <th>零售价</th>
            <th>零售金额</th>
            <th>进销差价</th>

          </thead>
             <tr    style="text-align: center;height: 30px;padding:0px;" v-for="(item, index) in tabeldata.drug_item"
              :key="index">
              <td style="width:260px">{{item.name}}</td>
              <td style="width:">{{item.specification}}</td>
              <td style="width:">
                  {{item.fill_no}}
              </td>

              

              <td style="width:">{{item.num}}</td>

              <td style="width:">{{item.base_unit}}</td>
              <td style="width:、">{{item.buy_price}}</td>
              <td style="width:">{{item.buy_amount}}</td>
               <td style="width:">{{item.price}}</td>
                <td style="width:">{{item.sale_amount}}</td>
                 <td style="width:">{{item.diff_amount}}</td>
             
            </tr>

            <tr style="text-align: center;height: 30px;padding:0px;" >
              <td>药品入库合计(零售)</td><td colspan="5">{{tabeldata.total_amount}}</td><td>{{tabeldata.buy_amount}}</td><td colspan="2">{{tabeldata.sale_amount}}</td><td>{{tabeldata.diff_amount}}</td>
              </tr>
          </table>
          <div style="
          height:30px;width:100%;
      
          line-height:28px;
           text-align: center;
           font-weight: 600;
          "
          class="span5"
          >
           库管：<span> &nbsp;</span>   会计： <span>&nbsp;</span>    记账：<span>&nbsp;</span>   采购：<span>&nbsp;</span>   审核员：<span>{{tabeldata.create_by_info.real_name}}</span>
          </div>
        </div>
       <p style="text-align: center;">第1 页 /共 1 页 </p>
       <!-- <p style="page-break-after: always;"></p> -->
      </div>
    </div>
  </div>
</template>
<script>
import { getdictIndex } from "@/api/register";
import { printHospitalFee} from "@/api/zhuyanre"
 import print from 'print-js'
import { mapState,mapActions } from "vuex";
export default {
  props: ["id"],
  data() {
    return {

      sourcelist: [],
      arrdata: [],
      drug2: [],
      dayin: false,
      tabeldata:{},
      feelist:[],
     
      his_name:process.env.VUE_APP_HOSPITAL_API
    };
  },

  mounted() {
    this.tianjiaids2()
  },
  watch: {
    id(n) {
		this.tianjiaids2()
    },
  },
  methods: {
         ...mapActions([
        
            'storage/getdrug_into_storeShow',
   
         
       
			]),
    tianjiaids2() {
        // printHospitalFee({hospital_id:this.id}).then(res=>{
        //       this.tabeldata=res.data
        //       this.feelist=res.data.fee
        //       this.scliplist(this.feelist)
        // })
        this['storage/getdrug_into_storeShow']({id:this.id}).then(res=>{
                if(res.code==200)
                {
              this.tabeldata=res.data
                console.log("res",res)
                }
               })
    },
    // scliplist(list){
    //   var datalist=[]
    //     for(let i in list){
    //       var  arr=list[i].lists
    //       for(let j in arr){
    //           arr[j].type2='1'
    //              arr[j].cate_name=list[i].cate_name
    //               arr[j].cate_money=list[i].cate_money
    //       }
         
    //       arr.push({
    //         money: list[i].cate_name,
    //         name: list[i].cate_name,
    //         cate_money:list[i].cate_money,

    //         no: "",
    //         number: '',
    //         price: "",
    //         type: "",
    //         type2: "2",
    //         unit: "",
    //       })
    //         datalist=datalist.concat(arr)
            
    //     }
    //     console.log(datalist.length)
    //        if (datalist.length > 30) {
     
    //     for (let it = 0; it < Math.ceil(datalist.length / 30); it++) {
    //        this.drug2.push(datalist.slice(it*30, 30*(it+1)));
          
    //     }
    
    //   } else {
    //     this.drug2.push(datalist.slice(0, 30));
        
    //   }
    //   // var aty = this.drug2[this.drug2.length - 1];
    //   // var num = 30 - parseInt(aty.length);

    //   // if (num < 30) {
    //   //   for (let i = 0; i < num; i++) {
    //   //     this.drug2[this.drug2.length - 1].push({
    //   //       money: '',
    //   //       name: '',
    //   //       no: "",
    //   //       number: '',
    //   //       price: "",
    //   //       type: "",
    //   //       type2: "1",
    //   //       unit: "",
    //   //     });
    //   //   }
    //   // }
    //     console.log(this.drug2,'11111')
    // },
    printBtn(e) {
      this.dayin = true;
      setTimeout(() => {
        this.dayinfun();
      }, 200);
    },
    dayinfun() {
      const style = '@page {margin:20mm 10mm};'
        setTimeout(function() {
        print({
          printable: 'printcons',	//打印区域id
          type: 'html',		//打印类型是html
          scanStyles: false,
          targetStyles: ['*'],
          style,
           documentTitle:"EFFORT", 
        repeatTableHeader:true, 
        })
    
      }, 500)
// ————————————————
// 版权声明：本文为CSDN博主「Fabricant」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
// 原文链接：https://blog.csdn.net/Fabricant/article/details/119457914
      // this.remove_ie_header_and_footer();
      // let subOutputRankPrint = document.getElementById("printcons");
      // console.log(subOutputRankPrint.innerHTML);
      // let newContent = subOutputRankPrint.innerHTML;
      // let oldContent = document.body.innerHTML;
      // document.body.innerHTML = newContent;
      // window.print();
      //   window.location.reload();
      // this.$emit("reload");
      // document.body.innerHTML = oldContent;
      // return false;
    },
    //去掉页眉和页脚
    remove_ie_header_and_footer() {
      var hkey_path;
      hkey_path =
        "HKEY_CURRENT_USER\\Software\\Microsoft\\Internet Explorer\\PageSetup\\";
      try {
        var RegWsh = new ActiveXObject("WScript.Shell");
        RegWsh.RegWrite(hkey_path + "header", "");
        RegWsh.RegWrite(hkey_path + "footer", "");
      } catch (e) {}
    },
  },
};
</script>
<style media="print">
@page {
  size: auto; /* auto is the initial value */
  margin: 0mm; /* this affects the margin in the printer settings */
}
@media print {
}
body {
  -webkit-print-color-adjust: exact;
}

</style>
<style lang='scss' scoped>
.span5>span{
  display: inline-block;
  width: 15%;
  height: 40px;
  border-bottom: 1px solid #000;
}

</style>